﻿<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!-- Latest Bootstrap min CSS -->
<link rel="stylesheet" href="static/css/bootstrap.min.css" type="text/css">
<!-- Dropdownhover CSS -->
<link rel="stylesheet" href="static/css/bootstrap-dropdownhover.min.css" type="text/css">
<!-- latest fonts awesome -->
<link rel="stylesheet" href="static/font/css/font-awesome.min.css" type="text/css">
<!-- simple line fonts awesome -->
<link rel="stylesheet" href="static/simple-line-icon/css/simple-line-icons.css" type="text/css">
<!-- stroke-gap-icons -->
<link rel="stylesheet" href="static/stroke-gap-icons/stroke-gap-icons.css" type="text/css">
<!-- Animate CSS -->
<link rel="stylesheet" href="static/css/animate.min.css" type="text/css">
<!-- Style CSS -->
<link rel="stylesheet" href="static/css/style.css" type="text/css">
<!--  baguetteBox -->
<link rel="stylesheet" href="static/css/baguetteBox.css">
<!-- Owl Carousel /static -->
<link href="static/owl-carousel/owl.carousel.css" rel="stylesheet">
<link href="static/owl-carousel/owl.theme.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<style type="text/css">
	.col-sm-9{ width: 100%;}
</style>
</head>

<body>
<!--  Preloader  -->
<div id="preloader">
	<div id="loading">
	</div>
</div>
<header>
	<!--  top-header  -->
	<div class="top-header">
		<div class="container">

			<div class="col-md-6">
				<div class="top-header-left">
					<ul>
						<li>
							<div class="dropdown">
								<a href="#" class="btn btn-default dropdown-toggle">
								   <img src="static/images/China.png" alt="eng-flg"> 中国
								</a>
							</div>
						</li>
						<li>
							<div class="dropdown">
								<a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
									联系我们
								</a>
							</div>
						</li>
						<li>
							<!--<span>Hello Custumer - Login or Registe!</span>-->
							<div class="dropdown">
								<a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-hover="dropdown">
									我的账户 <i class="fa fa-angle-down" aria-hidden="true"></i>
								</a>
								<ul class="dropdown-menu">
									<li><a href="#" onclick="registModel();">注册</a></li>
									<li><a href="#" onclick="loginModel();">登录</a></li>
								</ul>
								<span id="loginUserName"></span>
							</div>
						</li>
					</ul>
				</div>
			</div>
			<div class="col-md-6">
				<div class="top-header-right">
					<ul>
						<li><i class="icon-location-pin icons" aria-hidden="true"></i><a href="#" onclick="myAddressAll(1,9);">收货地址</a></li>
						<li><i class="icon-note icons" aria-hidden="true"></i><a href="#" onclick="myOrderAll(1,9);">我的订单</a></li>
						<li>
							<div class="dropdown">
								<a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-hover="dropdown">
									<i class="icon-settings icons" aria-hidden="true"></i> 设置
								</a>
								<ul class="dropdown-menu">
									<!--<li><a href="#">My Account</a></li>-->
									<li><a href="javascript:void(0);" onclick="updatePassword();">更改密码</a></li>
									<li><a href="#">改变地址</a></li>
								</ul>
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<!--  /top-header  -->
	</div>

	<section class="top-md-menu">
		<div class="container">
			<div class="col-sm-3">
				<div class="logo">
					<h6><img src="static/images/logo.jpg" alt="logo" /></h6>
				</div>
			</div>
			<div class="col-sm-6">
				<!-- Search box Start -->
				<form>
					<div class="well carousel-search hidden-phone">
						<div class="btn-group">
							<a class="btn dropdown-toggle btn-select" data-toggle="dropdown" href="#">所有类别<!--<span class="caret"></span>--></a>
						</div>
						<div class="search">
							<input type="text" id="textName" placeholder="Where prodect" />
						</div>
						<div class="btn-group">
							<button type="button" onclick="btnSearch();" class="btn btn-primary"><i class="fa fa-search" aria-hidden="true"></i></button>
						</div>
					</div>
				</form>
				<!-- Search box End -->
			</div>
			<div class="main-menu">
				<!--  nav  -->
				<nav class="navbar navbar-inverse navbar-default">
					<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1" data-hover="dropdown" data-animations=" fadeInLeft fadeInUp fadeInRight">
						<ul class="nav navbar-nav">
							<li class="all-departments dropdown">
								<a href="index.html" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><span> 图书种类列表</span> <i class="fa fa-bars" aria-hidden="true"></i> </a>
								<ul class="dropdown-menu dropdownhover-bottom all-open" id="menu" role="menu">
									<!--通过后台加载数据-->

								</ul>
							</li>
							<li><a href="javascript:void(0);" onclick="mainAjax();">首页</a></li>
							<li><a href="javascript:void(0);" onclick="errorShow();">图书列表</a></li>
							<li><a href="javascript:void(0);" onclick="errorShow();">联系我们</a></li>
							<li><a href="javascript:void(0);" onclick="cookieAjax(1,9,'0');">购物车</a></li>
							<li><a href="javascript:void(0);" onclick="errorShow();">结转</a></li>
						</ul>
						<!-- /.navbar-collapse -->
					</div>
				</nav>
				<!-- /nav end -->
			</div>
		</div>
	</section>
	<!-- header-outer -->
	<section class="header-outer">
		<!-- header-slider -->
			<div class="header-slider">					
					<div id="home-slider" class="carousel slide carousel-fade" data-ride="carousel">
						<!-- .home-slider -->
						<div class="carousel-inner">
							<div class="item active" style="background-image: url(static/images/home-header1.jpg);  background-repeat: no-repeat; background-position: top;">
							</div>
							<div class="item" style="background-image: url(static/images/home-header2.jpg);  background-repeat: no-repeat; background-position: top;">
							</div>
							<div class="item" style="background-image: url(static/images/home-header3.jpg);  background-repeat: no-repeat; background-position: top;">
							</div>
						</div>
						<!-- indicators -->
						<ol class="carousel-indicators">
							<li data-target="#home-slider" data-slide-to="0" class="active"></li>
							<li data-target="#home-slider" data-slide-to="1"></li>
							<li data-target="#home-slider" data-slide-to="2"></li>
						</ol>
						<!-- /indicators -->
						<!-- /.home-slider -->
					</div>					
			</div>
			<!-- /header-slider end -->			
	</section>
	<!-- /header-outer -->
</header>
<!-- banner -->
<section class="banner">
	<div class="container">
		<div class="row">
			<div class="col-xs-12 col-sm-4 col-md-4">
				<!-- banner-img -->
				<a href="#" class="banner-img">
					<!-- banner-text -->
					<div class="banner-text">
						<h3>ServerBook</h3>
						<h2>TabletBook</h2>
						<span class="price">Price: $720</span>
					</div>
					<!-- /banner-text -->
				</a>
				<!-- /banner-img -->
			</div>
			<div class="col-xs-12 col-sm-4 col-md-4">
				<!-- banner-img -->
				<a href="#" class="banner-img banner-img2">
					<!-- banner-text -->
					<div class="banner-text">
						<h3>ServerBook</h3>
						<h2>SmartBook</h2>
						<span class="price">Price: $220</span>
					</div>
					<!-- /banner-text -->
				</a>
				<!-- /banner-img -->
			</div>
			<div class="col-xs-12 col-sm-4 col-md-4">
				<!-- banner-img -->
				<a href="#" class="banner-img banner-img3">
					<!-- banner-text -->
					<div class="banner-text">
						<h3>ServerBook</h3>
						<h2>HeadBook</h2>
						<span class="price">Price: $150</span>
					</div>
					<!-- /banner-text -->
				</a>
				<!-- /banner-img -->
			</div>
		</div>
	</div>
</section>
<!-- /banner -->

<div id="centerHtml"></div>
<!-- all-product -->
<!--shopping-cart-->
<!--grid-shop-->
<section id="center" class="grid-shop">
	<!-- .grid-shop -->
	<div class="container">
		<div class="row">
			<div class="col-md-12">
				<ol class="breadcrumb">
					<!--<li class="breadcrumb-item"><a href="javascript:void(0);"><h3>《图书列表》</h3></a></li>-->
					<!--<li class="breadcrumb-item active">Library</li>-->
				</ol>
			</div>
			<div class="col-sm-9 col-md-9" id="center_boom">
				<!--动态加载后台数据-->
			</div>
			<div class="col-xs-12">
				<div class="grid-spr pag">
					<!-- .pagetions -->
					<div class="col-xs-12 col-sm-6 col-md-6 text-left">
						<!--分页栏-->
						<ul class="pagination" id="pagination">
							<li><a href="javascript:void(0);" onclick="findOnePage(1)">首页</a></li>
							<li id="prev"><a href="javascript:void(0);" onclick="findFastPage()">上一页</a></li>
							<li><a href="javascript:void(0);" onclick="findRowsPage(1)">1</a></li>
							<li><a href="javascript:void(0);" onclick="findRowsPage(2)">2</a></li>
							<li><a href="javascript:void(0);" onclick="findRowsPage(3)">3</a></li>
							<li id="next"><a href="javascript:void(0);" onclick="findNextPage()">下一页</a></li>
							<li><a href="javascript:void(0);" onclick="findLastPage()">尾页</a></li>
						</ul>
					</div>
					<!-- /.pagetions -->
				</div>
			</div>
		</div>
	</div>
	<!-- /.grid-shop -->
</section>



<!-- /all-product -->

<footer>
	<div class="container">
		<div class="row">
			<div class="col-xs-12 col-sm-4 col-md-4">
				<!-- f-weghit -->
				<div class="f-weghit">
					<img src="static/images/logo.jpg" alt="logo" />
					<p><strong>Complex</strong> is a premium Templates theme with advanced admin module. It’s extremely customizable, easy to use and fully responsive and retina ready.</p>
					<ul>
						<li><i class="icon-location-pin icons" aria-hidden="true"></i> <strong>Add:</strong>湖南工学院416</li>
						<li><i class="icon-envelope-letter icons"></i> <strong>Email:</strong> 1047441153@qq.com</li>
						<li><i class="icon-call-in icons"></i> <strong>Phone Number:</strong> (800) 123 456 789</li>
					</ul>
				</div>
				<!-- /f-weghit -->
			</div>
			<div class="col-xs-12 col-sm-4 col-md-4">
				<!-- f-weghit2 -->
				<div class="f-weghit2">
					<h4>INFORMATION</h4>
					<ul>
						<li><a href="#">About Us</a></li>
						<li><a href="#">Contact Us</a></li>
						<li><a href="#">All Collection</a></li>
						<li><a href="#">Privacy policy</a></li>
						<li><a href="#">Terms & conditio</a></li>
					</ul>
				</div>
				<!-- /f-weghit2 -->
				<!-- f-weghit2 -->
				<div class="f-weghit2">
					<h4>CATEGORIES</h4>
					<ul>
						<li><a href="#">Fashion</a></li>
						<li><a href="#">Electronics</a></li>
						<li><a href="#">Furnitured & Decor</a></li>
						<li><a href="#">Jewelry & Watches</a></li>
						<li><a href="#">Health & Beauty</a></li>
					</ul>
				</div>
				<!-- /f-weghit2 -->
			</div>
			<!-- copayright -->
			<div class="copayright">
				<div class="row">
					<div class="col-xs-12 col-sm-6 col-md-6">
						Copyright &copy; 2019.Company name All rights reserved.
					</div>

				</div>
			</div>
			<!-- /copayright -->

		</div>
	</div>
</footer>

<p id="back-top">
	<a href="#top"><i class="fa fa-chevron-up" aria-hidden="true"></i></a>
</p>


<!--注册模态框-->
<div class="modal fade" id="registModel" tabindex="-1" role="dialog"
	 aria-labelledby="exampleModalLabel">
	<div class="modal-dialog" role="document">
		<div class="modal-content">

			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title" id="exampleModalLabel">用户注册</h4>
			</div>

			<div class="modal-body">
				<form action="" method="post" id="registForm">
					<div class="form-group">
						<label class="control-label">ID:</label> <input
							type="text" class="form-control" id="uId" name="uId">
					</div>

					<div class="form-group">
						<label class="control-label">姓名:</label> <input
							type="text" class="form-control" id="uName" name="uName">
					</div>

					<div class="form-group">
						<label class="control-label">昵称:</label> <input
							 type="text" class="form-control"
							id="uNice" name="uNice">
					</div>

					<div class="form-group">
						<label for="uPhone" class="control-label">电话:</label> <input
							type="text" class="form-control" id="uPhone" name="uPhone">
					</div>

					<div class="form-group">
						<label for="uSex" class="control-label">性别:</label><br /> <input
							type="radio" class="control-label" id="uSex" value="男"
							name="uSex" />男 <input type="radio" class="control-label"
													 id="uSex1" value="女" name="uSex" />女
					</div>

					<div class="form-group">
						<label for="uEmail" class="control-label">电子邮箱:</label> <input
							type="text" class="form-control" id="uEmail" name="uEmail">
					</div>

					<div class="form-group">
						<label for="file" class="control-label">图像:</label> <input
							type="file" class="form-control"
							id="file" name="file">
					</div>
			</div>
			</form>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="关闭" onclick="closeModel();">关闭</button>
				<button type="button" class="btn btn-primary" onclick="registerUser();">注册</button>
			</div>
		</div>
	</div>
</div>

<!--修改-->
<div class="modal fade" id="updateModelPassword" tabindex="-1" role="dialog" aria-labelledby="myUpdateModel">
	<div class="modal-dialog">
		<div class="modal-content">
			<!--登陆框头部-->
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
					×
				</button>
				<h4 class="modal-title" id="myUpdateModel">
					密码修改！
				</h4>
			</div>
			<!--登陆框中间部分(from表单)-->
			<div class="modal-body">
				<form class="form-horizontal" role="form" id="updatePassword">
					<!--用户框-->
					<div class="form-group">
						<label for="username" class="col-sm-2 control-label">手机号码</label>
						<div class="col-sm-10">
							<input type="text" class="form-control" id="phone" placeholder="username" required="required">
						</div>
					</div>
					<!--密码框-->
					<div class="form-group">
						<label for="password" class="col-sm-2 control-label" >新密码</label>
						<div class="col-sm-10">
							<input type="password" class="form-control" id="newPassword" placeholder="password" required="required">
						</div>
					</div>
					<!--登陆按钮-->
					<div class="form-group">
						<div class="col-sm-offset-2 col-sm-10">
							<button type="button" class="btn btn-default" onclick="ajaxUpdatePassword();">修改</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>

<!--登录-->
<div class="modal fade" id="loginModel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
	<div class="modal-dialog">
		<div class="modal-content">
			<!--登陆框头部-->
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
					×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					欢迎登陆！
				</h4>
			</div>
			<!--登陆框中间部分(from表单)-->
			<div class="modal-body">
				<form class="form-horizontal" role="form" id="loginForm">
					<!--用户框-->
					<div class="form-group">
						<label for="username" class="col-sm-2 control-label">用户名</label>
						<div class="col-sm-10">
							<input type="text" class="form-control" id="username" placeholder="username" required="required">
						</div>
					</div>
					<!--密码框-->
					<div class="form-group">
						<label for="password" class="col-sm-2 control-label" >密码</label>
						<div class="col-sm-10">
							<input type="password" class="form-control" id="password" placeholder="password" required="required">
						</div>
					</div>
					<!--记住密码-->
					<div class="form-group">
						<div class="col-sm-offset-2 col-sm-10">
							<div class="checkbox">
								<label>
									<input type="checkbox"> 记住密码
								</label>
							</div>
						</div>
					</div>
					<!--登陆按钮-->
					<div class="form-group">
						<div class="col-sm-offset-2 col-sm-10">
							<button type="button" class="btn btn-default" onclick="ajaxUserLogin();">登录</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>

<!--地址模块-->
<div class="modal fade" id="addressModel" tabindex="-1" role="dialog"
	 aria-labelledby="addressModalLabel">
	<div class="modal-dialog" role="document">
		<div class="modal-content">

			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title" id="addressModalLabel">地址添加</h4>
			</div>

			<div class="modal-body">
				<form action="" method="post" id="addressForm">
					<div class="form-group">
						<label class="control-label">ID:</label> <input
							type="text" class="form-control" id="addId" name="addId">
					</div>

					<div class="form-group">
						<label class="control-label">姓名:</label> <input
							type="text" class="form-control" id="addName" name="addName">
					</div>

					<div class="form-group">
						<label class="control-label">电话:</label>
						<input type="text" class="form-control" id="addPhone" name="addPhone">
					</div>

					<div class="form-group">
						<label for="uPhone" class="control-label">编码:</label> <input
							type="text" class="form-control" id="addCode" name="addCode">
					</div>

					<div class="form-group">
						<label for="uSex" class="control-label">省份:</label>
						<input type="text" class="form-control" id="addProvince" name="addProvince">
					</div>

					<div class="form-group">
						<label for="uEmail" class="control-label">城市:</label> <input
							type="text" class="form-control" id="addCicty" name="addCicty">
					</div>

					<div class="form-group">
						<label for="uEmail" class="control-label">区域:</label> <input
							type="text" class="form-control" id="addArea" name="addArea">
					</div>

					<div class="form-group">
						<label for="uEmail" class="control-label">详细地址:</label> <input
							type="text" class="form-control" id="addAdderss" name="addAdderss">
					</div>
			</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="关闭" onclick="closeAddressModel();">关闭</button>
				<button type="button" class="btn btn-primary" onclick="addressAdd();">添加</button>
			</div>
		</div>
	</div>
</div>

<!--支付模块-->
<div class="modal fade" id="checkOutModel" tabindex="-1" role="dialog"
	 aria-labelledby="checkOutModelLabel">
	<div class="modal-dialog" role="document">
		<div class="modal-content">

			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title" id="checkOutModelLabel">支付</h4>
			</div>

			<div class="modal-body">
				<form action="" method="post" id="payForm">
					<div class="form-group">
						<label class="control-label">图书名称:</label> <input
							type="text" class="form-control" id="bookName" name="bookName">
					</div>

					<div class="form-group">
						<label class="control-label">订单总额:</label> <input
							type="text" class="form-control" id="oTotal" name="oTotal">
					</div>

					<div class="form-group">
						<label class="control-label">优惠折扣:</label>
						<input type="text" class="form-control" id="oDiscount" name="oDiscount">
					</div>

					<div class="form-group">
						<label for="uPhone" class="control-label">应付金额:</label> <input
							type="text" class="form-control" id="oPay" name="oPay">
					</div>

					<div class="form-group">
						<label for="uSex" class="control-label">付钱接口:</label>
						<input type="text" class="form-control" id="payInterface" name="payInterface">
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="关闭" onclick="closePayModel();">关闭</button>
				<button type="button" class="btn btn-primary" onclick="payCheckOut();">支付</button>
			</div>
		</div>
	</div>
</div>




<script src="static/js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="static/js/bootstrap.min.js"></script>
<script src="static/js/bootstrap-dropdownhover.min.js"></script>
<script src="static/js/bookList.js"></script>
<!-- Plugin JavaScript -->
<script src="static/js/jquery.easing.min.js"></script>
<script src="static/js/wow.min.js"></script>
<!-- owl carousel -->
<script src="static/owl-carousel/owl.carousel.js"></script>
<!--  Custom Theme JavaScript  -->
<script src="static/js/custom.js"></script>
<script src="static/js/index.js"></script>


</body>

</html>
